<%@ page language="java" import="java.util.*" pageEncoding="utf-8" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>档案修改</title>

    <link rel="stylesheet" type="text/css" href="./bootstrap/css/bootstrap.min.css">
    <link href="./bootstrap/css/styles.css" rel="stylesheet">

</head>

<body>
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
    <div class="container-fluid">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse"
                    data-target="#sidebar-collapse">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a class="navbar-brand" href="CustomerManage.html"><span>实验动物</span>档案管理</a>
            <ul class="user-menu">
                <li class="dropdown pull-right">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown"><span
                            class="glyphicon glyphicon-user"></span> User <span class="caret"></span></a>
                    <ul class="dropdown-menu" role="menu">
                        <li><a href="http://www.cau.edu.cn"><span class="glyphicon glyphicon-user"></span> Profile</a>
                        </li>
                        <li><a href="#"><span class="glyphicon glyphicon-cog"></span> Settings</a></li>
                        <li><a href="login.jsp"><span class="glyphicon glyphicon-log-out"></span> Logout</a></li>
                    </ul>
                </li>
            </ul>
        </div>

    </div><!-- /.container-fluid -->
</nav>
<div id="sidebar-collapse" class="col-sm-3 col-lg-2 sidebar">
    <form role="search">
        <div class="form-group">
            <input type="text" class="form-control" placeholder="Search">
        </div>
    </form>
    <ul class="nav menu">
        <li class="parent ">
            <a href="#">
                <span class="glyphicon glyphicon-list"></span> 用户信息管理 <span data-toggle="collapse" href="#sub-item-1"
                                                                            class="icon pull-right"><em
                    class="glyphicon glyphicon-s glyphicon-plus"></em></span>
            </a>
            <ul class="children collapse" id="sub-item-1">
                <li>
                    <a class="" href="CustomerPersonalInformation.jsp">
                        <span class="glyphicon glyphicon-share-alt"></span> 个人信息
                    </a>
                </li>
                <li>
                    <a class="" href="CustomerChangePassword.jsp">
                        <span class="glyphicon glyphicon-share-alt"></span> 修改密码
                    </a>
                </li>
            </ul>
        </li>

        <li class="parent ">
            <a href="#">
                <span class="glyphicon glyphicon-list"></span> 档案处理 <span data-toggle="collapse" href="#sub-item-2"
                                                                          class="icon pull-right"><em
                    class="glyphicon glyphicon-s glyphicon-plus"></em></span>
            </a>
            <ul class="children collapse" id="sub-item-2">
                <li>
                    <a class="" href="CustomerCreateFile.jsp">
                        <span class="glyphicon glyphicon-share-alt"></span> 档案填写
                    </a>
                </li>
                <li>
                    <a class="" href="CustomerQueryFile.jsp">
                        <span class="glyphicon glyphicon-share-alt"></span> 档案查询
                    </a>
                </li>
                <li>
                    <a class="" href="CustomerUpdatefile.jsp">
                        <span class="glyphicon glyphicon-share-alt"></span> 档案修改
                    </a>
                </li>
            </ul>
        </li>

        <li role="presentation" class="divider"></li>
        <li><a href="login.jsp"><span class="glyphicon glyphicon-user"></span>登录页面</a></li>
    </ul>
    <div class="attribution">Created by <a href="#">软工第9组</a></div>
</div><!--/.sidebar-->


<div class="col-sm-9 col-sm-offset-3 col-lg-10 col-lg-offset-2 main">
    <div class="row">
        <ol class="breadcrumb">
            <li><a href="CustomerManage.html"><span class="glyphicon glyphicon-home"></span></a></li>
            <li class="active">档案信息处理 > 档案查询</li>
        </ol>
    </div>
    <div class="col-lg-12" style="padding-top: 10px;">
        <form role="form" class="form-inline" method="post" action="CutomerQueryFile.jsp" >
            <fieldset>
                <div class="form-group">
                    选择显示档案数据：
                    <select id="show">
                        <option value="">请选择</option>
                        <option value="1">日常档案</option>
                        <option value="2">实验档案</option>
                    </select>
                </div>
            </fieldset>
        </form>
    </div>
            <div class="col-lg-12 hide query" style="padding-top: 10px;">
                <form role="form" class="form-inline" method="post" action="CutomerQueryFile.jsp" >
                    <fieldset>
                        <div class="form-group">
                            档案编号：
                            <input class="form-control FileNumber" placeholder="档案编号" id="fileNumber" name="fileNumber" type="text" >
                        </div>
                        <div class="form-group">
                            档案名称：
                            <input class="form-control FileNumber" placeholder="档案名称" id="fileTitle" name="fileTitle" type="text" >
                        </div>
                        <div class="form-group">
                            动物编号：
                            <input class="form-control FileNumber" placeholder="动物编号" id="animalId" name="animalId" type="text" >
                        </div>
                        <div class="form-group">
                            <input class="form-control btn btn-primary chaxun"  type="text" value="查询" >
                        </div>
                    </fieldset>
                </form>
            </div>

    <!-- 从这开始添加代码 -->

    <div class="row hide table1">
        <div class="col-lg-12">
            <!-- <iframe src="Home.html" width="100%" height="620px" ></iframe> -->
            <h3>
                <center><b>日常档案查询</b></center>
            </h3>
            <div class="row">
                <div class="col-lg-12">
                    <table class="table table-striped">
                        <thead>
                        <tr>
                            <th>档案编号</th>
                            <th>档案名称</th>
                            <th>填写日期</th>
                            <th>用户编号</th>
                            <th>动物编号</th>
                            <th>审核</th>
                            <th>日常动物信息备注</th>
                            <th>文件</th>
                            <th>操作</th>
                        </tr>
                        </thead>
                        <tbody id="table1">
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
    <div class="row hide table2">
        <div class="col-lg-12">
            <h3>
                <center><b>实验档案查询</b></center>
            </h3>
            <div class="row">
                <div class="col-lg-12">
                    <table class="table table-striped">
                        <thead>
                        <tr>
                            <th>档案编号</th>
                            <th>档案名称</th>
                            <th>填写日期</th>
                            <th>实验日期</th>
                            <th>用户编号</th>
                            <th>动物编号</th>
                            <th>审核</th>
                            <th>实验动物信息备注</th>
                            <th>文件</th>
                            <th>操作</th>
                        </tr>
                        </thead>
                        <tbody id="table2">
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>


<script src="./bootstrap/js/jquery-3.1.0.min.js"></script>
<script src="./bootstrap/js/bootstrap.min.js"></script>

<script>
    $("#show").change(function() {
        let val = $(this).val();
        $(".query").removeClass("hide")
        if (val == 1) {
            $(".table1").removeClass("hide");
            $(".table2").addClass("hide");
            $.ajax({
                url: './QueryDailyArchive',
                type: 'get',
                dataType: 'json',
                async: true,
                success: function (response) {
                    let html = "";
                    for (let i = 0; i < response.length; i++) {
                        let dailyarchive = response[i];
                        html += "<tr>" +
                            "<td>" + dailyarchive.fileNumber + "</td>" +
                            "<td>" + dailyarchive.fileTitle + "</td>" +
                            "<td>" + dailyarchive.fillingDate + "</td>" +
                            "<td>" + dailyarchive.userId + "</td>" +
                            "<td>" + dailyarchive.animalId + "</td>" +
                            "<td>" + dailyarchive.fileState + "</td>" +
                            "<td>" + dailyarchive.dailyDataTip + "</td>" +
                            "<td>" + dailyarchive.file + "</td>" +
                            "<td><a href='<%=basePath%>DownloadFile?filename="+encodeURIComponent(dailyarchive.file)+"'>下载</a></td>" +
                            "<td><a target='_blank' href='<%=basePath%>PreviewFile?file="+encodeURIComponent(dailyarchive.file)+"'>预览</a></td>" +
                            "<td><a href='CustomerUpdateDailyFile.jsp?fileNumber="+dailyarchive.fileNumber+"'>编辑</a></td>" +
                            "</tr>";
                    }
                    $("#table1").html(html);
                },
                error: function () {
                    alert("操作失败");
                }
            });
        } else {
            $(".table1").addClass("hide");
            $(".table2").removeClass("hide");
            $.ajax({
                url: './QueryLaboratoryArchive',
                type: 'get',
                dataType: 'json',
                async: true,
                success: function (response) {
                    let html = "";
                    for (let i = 0; i < response.length; i++) {
                        let dailyarchive = response[i];
                        html += "<tr>" +
                            "<td>" + dailyarchive.fileNumber + "</td>" +
                            "<td>" + dailyarchive.fileTitle + "</td>" +
                            "<td>" + dailyarchive.fillingDate + "</td>" +
                            "<td>" + dailyarchive.experimentDate + "</td>" +
                            "<td>" + dailyarchive.userId + "</td>" +
                            "<td>" + dailyarchive.animalId + "</td>" +
                            "<td>" + dailyarchive.fileState + "</td>" +
                            "<td>" + dailyarchive.experimentDataTip + "</td>" +
                            "<td>" + dailyarchive.file + "</td>" +
                            "<td><a href='<%=basePath%>DownloadFile?filename="+encodeURIComponent(dailyarchive.file)+"'>下载</a></td>" +
                            "<td><a target='_blank' href='<%=basePath%>PreviewFile?file="+encodeURIComponent(dailyarchive.file)+"'>预览</a></td>" +
                            "<td><a href='CustomerUpdateExperimentalFile.jsp?fileNumber="+dailyarchive.fileNumber+"'>编辑</a></td>" +
                            "</tr>";
                    }
                    $("#table2").html(html);
                },
                error: function () {
                    alert("操作失败");
                }
            });
        }

    });

    $(".chaxun").on("click", function () {
        let fileNumber = $("#fileNumber").val();
        let fileTitle = $("#fileTitle").val();
        let animalId = $("#animalId").val();
        $.ajax({
            url: './QueryDailyArchive',
            type: 'get',
            data: {fileNumber, fileTitle, animalId},
            dataType: 'json',
            async: true,
            success: function (response) {
                let html = "";
                debugger
                for (let i = 0; i < response.length; i++) {
                    let dailyarchive = response[i];
                    html += "<tr>" +
                        "<td>" + dailyarchive.fileNumber + "</td>" +
                        "<td>" + dailyarchive.fileTitle + "</td>" +
                        "<td>" + dailyarchive.fillingDate + "</td>" +
                        "<td>" + dailyarchive.userId + "</td>" +
                        "<td>" + dailyarchive.animalId + "</td>" +
                        "<td>" + dailyarchive.fileState + "</td>" +
                        "<td>" + dailyarchive.dailyDataTip + "</td>" +
                        "<td>" + dailyarchive.file + "</td>" +
                        "<td><a href='<%=basePath%>DownloadFile?filename="+encodeURIComponent(dailyarchive.file)+"'>下载</a></td>" +
                        "<td><a target='_blank' href='<%=basePath%>PreviewFile?file="+encodeURIComponent(dailyarchive.file)+"'>预览</a></td>" +
                        "<td><a href='CustomerUpdateDailyFile.jsp?fileNumber="+dailyarchive.fileNumber+"'>编辑</a></td>" +
                        "</tr>";
                }
                $("#table1").html(html);
            },
            error: function () {
                alert("操作失败");
            }
        });
        $.ajax({
            url: './QueryLaboratoryArchive',
            type: 'get',
            data: {fileNumber, fileTitle, animalId},
            dataType: 'json',
            async: true,
            success: function (response) {
                let html = "";
                for (let i = 0; i < response.length; i++) {
                    let dailyarchive = response[i];
                    html += "<tr>" +
                        "<td>" + dailyarchive.fileNumber + "</td>" +
                        "<td>" + dailyarchive.fileTitle + "</td>" +
                        "<td>" + dailyarchive.fillingDate + "</td>" +
                        "<td>" + dailyarchive.experimentDate + "</td>" +
                        "<td>" + dailyarchive.userId + "</td>" +
                        "<td>" + dailyarchive.animalId + "</td>" +
                        "<td>" + dailyarchive.fileState + "</td>" +
                        "<td>" + dailyarchive.experimentDataTip + "</td>" +
                        "<td>" + dailyarchive.file + "</td>" +
                        "<td><a href='<%=basePath%>DownloadFile?filename="+encodeURIComponent(dailyarchive.file)+"'>下载</a></td>" +
                        "<td><a target='_blank' href='<%=basePath%>PreviewFile?file="+encodeURIComponent(dailyarchive.file)+"'>预览</a></td>" +
                        "<td><a href='CustomerUpdateExperimentalFile.jsp?fileNumber="+dailyarchive.fileNumber+"'>编辑</a></td>" +
                        "</tr>";
                }
                $("#table2").html(html);
            },
            error: function () {
                alert("操作失败");
            }
        });
    })


    !function ($) {
        $(document).on("click", "ul.nav li.parent > a > span.icon", function () {
            $(this).find('em:first').toggleClass("glyphicon-minus");
        });
        $(".sidebar span.icon").find('em:first').addClass("glyphicon-plus");
    }(window.jQuery);
    /**
     $(window).on('resize', function () {
  if ($(window).width() > 768) $('#sidebar-collapse').collapse('show')
})
     $(window).on('resize', function () {
  if ($(window).width() <= 767) $('#sidebar-collapse').collapse('hide')
})
     */
</script>

</body>

</html>
